<!--
  Generated template for the TeamMyPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <ion-title>团队</ion-title>
    <ion-buttons end (click)="openNewTeamPage()">
      <button ion-button icon-only>
        <ion-icon name="tianjia"></ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>

</ion-header>


<ion-content>
  <div class="a-tabs" [ngClass]="{'join' : tabsActiveIndex == 0, 'new' : tabsActiveIndex == 1, 'last' : tabsActiveIndex == 2}">
    <a (click)="toggle(0)">全部团队</a>
    <a (click)="toggle(1)">我加入的</a>
    <a (click)="toggle(2)">我创建的</a>
  </div>

  <div>
    <ion-slides (ionSlideDidChange)="changeSelect()">

      <ion-slide>
        <div>
          <ion-list>
            <ion-item *ngFor="let item of teamAllDatas, let index = index" (click)="openTeamDetail(item.teamcode)" [ngClass]="{'bg-toggle': (index + 1) % 2 == 0}">
              <ion-avatar item-start>
                <img src="{{item.teamicon}}">
              </ion-avatar>
              <h2 class="teamName">{{item.teamname}}</h2>
              <p>{{item.teamcount}}人</p>
              <ion-icon name="qianjin"></ion-icon>
            </ion-item>
          </ion-list>
        </div>
      </ion-slide>

      <ion-slide>
        <ion-list>
          <ion-item *ngFor="let item of teamDatas, let index = index" (click)="openTeamDetail(item.teamcode)" [ngClass]="{'bg-toggle': (index + 1) % 2 == 0}">
            <ion-avatar item-start>
              <img src="{{item.teamicon}}">
            </ion-avatar>
            <h2 class="teamName">{{item.teamname}}</h2>
            <p>{{item.teamcount}}人</p>
            <ion-icon name="qianjin"></ion-icon>
          </ion-item>
        </ion-list>
      </ion-slide>

      <ion-slide>
        <ion-list>
          <ion-item *ngFor="let item of myCreateTeams" (click)="openTeamDetail(item.teamcode)">
            <ion-avatar item-start>
              <img src="{{item.teamicon}}">
            </ion-avatar>
            <h2 class="teamName">{{item.teamname}}</h2>
            <p>{{item.teamcount}}人</p>
            <ion-icon name="qianjin"></ion-icon>
          </ion-item>
        </ion-list>
      </ion-slide>

    </ion-slides>
  </div>
</ion-content>
